<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>    
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<style>
	#title{
		text-align: center;
	}
	#emp-table{
		text-align: center;
		margin: 0 auto;
		width: 600px;
		border: 1px solid black;
		border-collapse: collapse;   /* 边框折叠 */
	}
	#emp-table td,#emp-table th{
		border: 1px solid black;
		line-height: 30px;
	}
	
	#emp-table tr:nth-child(1) {
		background-color: rgb(232, 242, 254);
	}
	
	#emp-table tr:nth-child(even) {
		background-color: rgb(225, 230, 246);
	}
	
	#emp-table tr:hover {
	   background-color: yellow;
	}
	#div-add{
		width: 600px;
		margin: 0 auto;
		text-align: right;
	}
</style>
<script src="${pageContext.request.contextPath }/webjars/jquery/3.5.1/jquery.min.js"></script>
<script>
	$(function(){
		$(".delete").click(function(){
			/* alert(this.href); */
			if(confirm("确定删除吗？")){
				$("#f1").attr("action",this.href).submit();
			}
			return false;
		})
	});
</script>
</head>
<body>

	<h1 id="title">员工列表</h1>
	<div id="div-add">
		<a href="${pageContext.request.contextPath }/emp/add">新增</a>
	</div>
	<table id="emp-table">
		<tr>
			<th>员工ID</th>
			<th>姓名</th>
			<th>年龄</th>
			<th>生日</th>
			<th>部门</th>
			<th>地址</th>
			<th>操作</th>
		</tr>
		<c:forEach items="${empList}" var="emp">
			<tr>
				<td>${emp.id}</td>
				<td>${emp.name}</td>
				<td>${emp.age}</td>
				<td>
					<fmt:formatDate value="${emp.birthday}" pattern="yyyy-MM-dd"/>
				</td>
				<td>${emp.deptName}</td>
				<td>${emp.address}</td>
				<td>
					<a href="${pageContext.request.contextPath }/emp/${emp.id }">修改</a>
					|
					<a class="delete" href="${pageContext.request.contextPath }/emp/${emp.id }">删除</a>
				</td>
			</tr>
		</c:forEach>
		
	</table>
	<form id="f1" method="post">
		<input type="hidden" name="_method" value="delete">
	</form>
	
</body>
</html>